<template>
  <TableView
    ref="tableView"
    :table-attrs="{ api: fetchList, descs: ['create_time'], dicOptions: [{ prop: 'status', dicType: 'pos_status' }] }"
    form-path="/space/fyroomposition/positionForm/{id:-1}"
    :search-model="searchForm"
    :delete-api="batchDelete"
    :tree-listeners="{ 'node-click': onNodeClick }"
    :tree-attrs="{
      fetchApi: houseTree,
      show: true,
      treeProps: { label: 'name' },
      lazy: false,
      'expand-first-node': true,
      customRootNode: { name: '全部', id: -1 }
    }"
    :toolbar-attrs="{
      buttons: ['slot', { del: 'position_fyroomposition_del', create: 'position_fyroomposition_add' }]
    }">
    <template #toolbar-button>
      <ToolbarButton
        privilege="position_fyroomposition_export"
        type="primary"
        icon="el-icon-download"
        label="导出"
        @click="exportExcel()" />
    </template>
    <template #columns>
      <TableColumn label="父位置" prop="parentName" clickable />
      <TableColumn label="房间名称" prop="houseName" clickable width="145" />
      <TableColumn label="位置名称" prop="name" width="140" clickable />
      <TableColumn label="位置编码" prop="code" clickable width="145" />
      <TableColumn label="面积" clickable prop="area" width="145" />
      <TableColumn label="租金" prop="rent" width="80" />
      <TableColumn label="状态" prop="status" width="60" />
      <TableColumn label="备注" prop="remarks" />
    </template>
    <template #search-form>
      <FormInput v-model="searchForm.parentName" label="父位置" prop="parentName" />
      <FormInput v-model="searchForm.name" label="位置名称" prop="name" />
      <FormInput v-model="searchForm.houseName" label="房间名称" prop="houseName" />
    </template>
  </TableView>
</template>

<script>
  import { services } from '@/config'
  import { fetchList, batchDelete } from '@/api/space/fyroomposition'
  import { houseTree } from '@/api/space/fyspacetree'

  export default {
    name: 'PositionView',
    data() {
      return {
        searchForm: {
          parentName: '',
          name: '',
          dataCode: '',
          houseName: ''
        }
      }
    },
    methods: {
      batchDelete,
      houseTree,
      fetchList,
      onNodeClick(node) {
        this.searchForm.dataCode = node.dataCode
        this.$refs.tableView.onSearchClick()
      },
      //  导出excel
      exportExcel() {
        this.$downBlobFile(
          `${services.spaceService}fyroomposition/export`,
          this.searchForm,
          `位置管理${this.$dateFormat(new Date())}.xlsx`
        )
      }
    }
  }
</script>
